import {Component, EventEmitter, Input, OnDestroy, OnInit, Output, ViewEncapsulation} from '@angular/core';
import {Subject} from "rxjs/Subject";
import {MatchService} from "../../match.service";




@Component({
  selector: 'match-notice',
  templateUrl: './match-notice.component.html',
  styleUrls: ['./match-notice.component.scss'],
  encapsulation: ViewEncapsulation.None
})
export class MatchNoticeComponent implements OnInit, OnDestroy {
  @Input() matchId;
  @Output() scrollComplete: EventEmitter<any> = new EventEmitter<any>();
  @Output() disabledScroll: EventEmitter<any> = new EventEmitter<any>();

  public notices = [];
  public params = {};
  public stateStore = {
    haveData: true,
    loadOver: false  // 是否已经加载完毕,默认无数据
  };
  public ngUnsubscribe: Subject<any> = new Subject<any>();

  constructor(public service: MatchService) {
  }

  /**
   * 查询赛事公告列表
   */
  getCompetitionNotice() {
    this.service.getCompetitionNotice(this.params).takeUntil(this.ngUnsubscribe).subscribe(res => {
      const notices = res.data.list;
      if (res.result === '0' && notices.length > 0) {
        this.params['page']++;
        this.scrollComplete.emit();

        this.notices = this.notices.concat(notices); // 合并数组
        if (!res.data.hasNextPage) {
          this.disabledScroll.emit(true);
        }
      } else {
        this.stateStore.haveData = false;
        this.disabledScroll.emit(false);
      }
    });
  }

  /**
   * 展开收起公告
   * @param e
   */
  articleToogle(e) {
    const toggleBtn = e.currentTarget;
    toggleBtn.parentNode.classList.toggle('block');

    if (toggleBtn.parentNode.className.indexOf('block') === -1) {
      toggleBtn.textContent = '全文';
    } else {
      toggleBtn.textContent = '收起';
    }
  }

  ngOnInit() {
    this.params = {
      matchId: this.matchId,
      page: 1,
      rows: 10
    };
  }

  ngOnDestroy() {
    this.ngUnsubscribe.next();
    this.ngUnsubscribe.complete();
  }
}
